<template>
  <Modal id="notes-modal"
         v-model="visible"
         width="800px"
         okText="保存笔记">
    <editor class="editor"
            ref="editor"
            :value="content"
            @on-change="handleChange" />
    <div slot="footer"
         class="footer">
      <Button type="primary"
              :loading="modal_loading"
              @click="save">保存</Button>
    </div>
  </Modal>
</template>
<script>
import Editor from '_c/editor'
import { mapState } from 'vuex'
import { updateStudentNotes, updateTeacherNotes, getStudentNote } from '@/api/data.js'
export default {
  data () {
    return {
      visible: false,
      content: '',
      liveData: {},
      modal_loading: false,
      id: ''
    }
  },
  props: ['userId'],
  computed: {
    ...mapState({
      hasGetInfo: state => state.user.hasGetInfo,
      // userId: state => state.user.userId,
      roleId: state => state.user.roleId
    })
  },
  mounted () {
    console.log(JSON.parse(sessionStorage.getItem("liveData")))
    this.liveData = JSON.parse(sessionStorage.getItem("liveData"))
  },
  methods: {
    init (id) {
      this.visible = true
      this.$nextTick(() => {
        let data = {
          courseId: this.liveData.courseId,
          userId: this.userId
        }
        getStudentNote(data).then(res => {
          if (res.data && res.data.length>0) {
            this.id = res.data[0].id
            this.$refs.editor.setHtml(res.data[0].content)
          }
        })
      })
    },
    handleChange (html, text) {

    },
    save () {

      // userId，courseId，content，
      let content = this.$refs.editor.getHtml()
      if (this.$refs.editor.getTxt() == '') {
        content = ''
      }
      let data = {
        id: this.userId,
        content
      }
      if (this.roleId == '3') {
        updateStudentNotes(data).then((res) => {
          // this.$emit('refreshDataList')
          if (res.data == 'success') {
            this.$Message.success('保存成功')
          } else {
            this.$Message.warning('保存失败')
          }
          this.visible = false
        })
      } else if (this.roleId == '2') {
        updateTeacherNotes(data).then((res) => {
          // this.$emit('refreshDataList')
          if (res.data == 'success') {
            this.$Message.success('保存成功')
          } else {
            this.$Message.warning('保存失败')
          }
          this.visible = false
        })
      }
    }
  },
  components: {
    Editor
  }
}
</script>
<style lang="scss">
#notes-modal {
  .ivu-modal-mask {
    z-index: 10000000000 !important;
  }
  .ivu-modal-wrap {
    z-index: 10000000000 !important;
  }
  .editor {
    margin-top: 40px;
  }
}
</style>
